<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>form</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="css/main-style.css" />
<link rel="shortcut icon" href="img/favicon.ico" />
<link rel="apple-touch-icon" href="img/touchicon.png" />
</head>
<body>

	<p class="u-content-title-p">表单演示</p>
	<hr class="u-hr-title" >
	<style>
.form-table {
	
}

.form-table td {
	vertical-align: middle;
	padding: 2px;
}

.form-table-label {
	width: 90px;
	text-align: right;
	height: 30px;
}

.form-table-item {
	
}

.form-required {
	color: #f00;
	font-size: 13px;
	font-family: SimSun;
	padding-right: 3px;
}

.form-info {
	height: 20px;
	color: #ddd;
	padding-top: 3px;
}
</style>
	<div style="padding-left: 40px">
		<ul>
			<li>ComboBox</li>
			<li>Input</li>
		</ul>
		<br> <br>
	</div>
	
	<style type="text/css">
		.table-layout {
		}
		.table-layout td {
			padding: 2px;
		}
		.form-item td{
			padding: 2px;
		}
		.form-item-label {
			width: 90px;
			text-align: right;
		}
	</style>
	
	<table class="table-layout">
		<tr>
			<td>
				<table class="form-item" >
					<tr>
						<td class="form-item-label"><span class="form-required">*</span>性别：</td>
						<td><input type="text" class="u-ipt"></td>
					</tr>
					<tr>
						<td></td>
						<td>&nbsp;111</td>
					</tr>
				</table>

			</td>
			<td>
				<table class="form-item" >
					<tr>
						<td class="form-item-label"><span class="form-required">*</span>性别：</td>
						<td><input type="text" class="u-ipt"></td>
					</tr>
					<tr>
						<td></td>
						<td>&nbsp;111</td>
					</tr>
				</table>
			</td>
		</tr>
		<tr>
			<td>
				<table class="form-item" >
					<tr>
						<td class="form-item-label"><span class="form-required">*</span>性别：</td>
						<td><input type="text" class="u-ipt"></td>
					</tr>
					<tr>
						<td></td>
						<td>&nbsp;111</td>
					</tr>
				</table>

			</td>
			<td>

				<table class="form-item" >
					<tr>
						<td class="form-item-label"><span class="form-required">*</span>性别：</td>
						<td><input type="text" class="u-ipt"></td>
					</tr>
					<tr>
						<td></td>
						<td>&nbsp;111</td>
					</tr>
				</table>
			</td>
		</tr>
		
		<tr>
			<td colspan="2" align="center">
				<input type="submit">
				<input type="reset">
			</td>
		</tr>

	</table>



	<br>
	<br>
	<br>
	<br>
	<br>

	<table class="form-table">
		<tr>
			<td class="form-table-label"><span class="form-required">*</span>ComboBox：
				<div class="form-info">&nbsp;</div></td>
			<td class="form-table-item"><input type="text" class="u-ipt" id="combox" value="">
				<div class="form-info">提示信息</div></td>
			<td class="form-table-label">INPUT：
				<div class="form-info">&nbsp;</div>
			</td>
			<td class="form-table-item"><input type="text" class="u-ipt" id="combox" value="">
				<div class="form-info">&nbsp;</div></td>
		</tr>
		<tr>
			<td class="form-table-label">CheckBox：
				<div class="form-info">&nbsp;</div>
			</td>
			<td><label> <input type="checkbox" value="">选项1
			</label> <label><input type="checkbox" value="">选项2 </label> <label><input type="checkbox" value="">选项3 </label> <label><input
					type="checkbox" value="">选项4 </label>
				<div class="form-info">&nbsp;11</div></td>
			<td class="form-table-label">CheckBox：
				<div class="form-info">&nbsp;</div>
			</td>
			<td><label><input type="radio" value="">选项1 &nbsp;&nbsp;</label> <label><input type="radio" value="">选项2 &nbsp;&nbsp;</label>
				<label><input type="radio" value="">选项3 &nbsp;&nbsp;</label> <label><input type="radio" value="">选项4 &nbsp;&nbsp;</label>
				<div class="form-info">&nbsp;</div></td>
		</tr>
		<tr>
			<td class="form-table-label"><span class="form-required">*</span>Select：
				<div class="form-info">&nbsp;</div></td>
			<td class="form-table-item"><select>
					<option>1111111111111</option>
					<option>1111111111111</option>
					<option>1111111111111</option>
					<option>1111111111111</option>
			</select>

				<div class="form-info">提示信息</div></td>
			<td class="form-table-label">INPUT：
				<div class="form-info">&nbsp;</div>
			</td>
			<td class="form-table-item"><input type="text" class="u-ipt" id="combox" value="">
				<div class="form-info">&nbsp;</div></td>
		</tr>
		<tr>
			<td colspan="4" align="center"><input type="submit"> &nbsp; &nbsp;<input type="reset"></td>
		</tr>
	</table>

</body>
<script type="text/javascript" src="sea-modules/sea.js" id="seajsnode"></script>
<script type="text/javascript" src="sea-modules/boot_i.js"></script>
<script type="text/javascript">
	seajs.use([ 'jquery', 'combox', 'test' ], function($, combox) {
		combox($('#combox'), {
			dataArray : [ {
				key : "男",
				"value" : '男'
			}, {
				key : "女",
				"value" : '女'
			}, {
				key : "d",
				"value" : "ddd"
			}, {
				key : "c",
				"value" : "cccdddd红色"
			}, {
				key : "ddd",
				"value" : "ajd红无经费"
			} ],
			selectOnly : false
		});
	});
</script>
</html>